<template>
  <el-dialog
    :visible.sync="visible"
    :close-on-click-modal="false"
    :title="title"
    @close="assignVipClose"
    width="352px"
    class="get_vip_dialog"
  >
    <el-form
      ref="form"
      :model="assignForm"
      :rules="assignRules"
      label-width="80px"
      label-position="top"
      class="get_form"
    >
      <el-form-item label="助教协作人" prop="assistantUserId">
        <UserSelect
          v-model="assignForm.assistantUserId"
          @input="userChange"
          style="width: 100%"
          v-if="visible"
        ></UserSelect>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="assignVipClose">取 消</el-button>
      <el-button type="primary" @click="assignVipSubmit">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import { chinaMobileRegex } from "@/utils";
import UserSelect from "@/views/admin/components/UserSelect";
import { distributionStudent } from "@/api/crm/vipStuPool.js";
export default {
  /**
   * vip池子-分配
   */
  name: "GetsVipStu",
  components: {
    UserSelect,
  },
  data() {
    return {
      visible: false,
      assignForm: {
        assistantUserId: "",
      },
      assignRules: {
        assistantUserId: [
          { required: true, message: "助教协作人不能为空", trigger: "change" },
        ],
      },
    };
  },
  watch: {
    assignDialog: {
      handler(val) {
        if (val) {
          this.visible = true;
        } else {
          this.visible = false;
        }
      },
      immediate: true,
    },
  },
  props: {
    assignDialog: {
      type: [Number, String, Boolean],
    },
    title: {
      type: String,
    },
    selectionList: {
      type: Array,
    },
  },
  methods: {
    /**
     * 弹框-关闭
     */
    assignVipClose() {
      this.$refs.form.resetFields();
      this.assignForm = {
        assistantUserId: "",
      };
      this.visible = false;
    },
    /**
     * 弹框-确定
     */
    assignVipSubmit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          let params = {
            ...this.assignForm,
          };
          params.ids = this.selectionList.map((item) => item.studentId);
          distributionStudent(params).then((res) => {
            if (res.code == 0) {
              this.$message.success("分配成功");
              this.visible = false;
              this.$emit("submit");
            } else {
              this.$message.error(res.msg, 2000);
            }
          });
        }
      });
    },
    /**
     * 助教协作人-change
     */
    userChange(data) {
      this.assignForm.assistantUserId = data;
      this.$refs.form.validateField("assistantUserId");
    },
  },
};
</script>
<style scoped lang="scss">
.get_vip_dialog {
  /deep/ .el-dialog__header {
    padding-top: 25px !important;
  }
  /deep/ .el-dialog__body {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
  .get_form {
    /deep/ .el-form-item__label {
      line-height: 6px !important;
    }
  }
}
</style>